<template>
  <div class="index">
    <div class="top-logo">辅学院</div>
    <!-- 轮播图 -->
    <div class="banner">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="(item, index) in bannerList" :key="index">
          <img :src="item.cdnImage" alt="" @click="goPage(item)" />
        </van-swipe-item>
      </van-swipe>
    </div>
    <!-- 知识中心 -->
    <div class="recommeng-course">
      <div class="title-common">
        <div class="title-lf">知识中心</div>
        <div class="title-rg" @click="checkMoreCourse">
          <span>全部</span>
          <i class="iconfont icon-xiangyoujiantou"></i>
        </div>
      </div>
      <div class="course-list">
        <div class="nodata" v-if="courseList.length == 0">
          <img src="@static/img/nodata.png" alt="" />
          <div>暂无数据</div>
        </div>
        <div class="course-item" v-for="(item, index) in courseList" :key="index" @click="gotoDetail(item)">
          <div class="course-cont">
            <div class="img">
              <img :src="item.imgUrl" alt="" />
            </div>
            <div class="name">{{ item.title }}</div>

            <div class="people">
              <i class="iconfont icon-tuandui"></i>
              <span>{{ item.studentNum }}人学习</span>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
import { getRemendCourse, getBannerList } from '@/api/index'
import { mapActions } from 'vuex'
import axios from 'axios'
export default {
  name: 'work',
  data() {
    return {
      isLoading: true,
      trainList: [],
      courseList: [],
      bannerList: [],
      surveyList: [], // 我的调研
      isShowDetail: false, // 是否显示考试详情
      examId: '', // 当前点击的考试id
      userData: {},
      isClose: false,
      companyId: window.localStorage.getItem('companyId')
    }
  },
  mounted() {
    if (window.localStorage.getItem('userInfo')) {
      this.userData = JSON.parse(window.localStorage.getItem('userInfo'))
    }

    this.getCourseList()
    this.getBannerList()

  },
  methods: {
    // 轮播图跳转
    goPage(item) {

    },

    // 前往学习
    gotoDetail(item) {
      this.$router.push({
        name: 'knowledgeDetail',
        query: {
          uuid: item.uuid
        }
      })
    },

    // 查看全部课程
    checkMoreCourse() {
      this.$router.push({
        name: 'knowledge'
      })
    },
    // 获取推荐课程
    getCourseList() {
      getRemendCourse({
        isLearned: 2,
        action: 'new',
        pageNum: 1,
        pageSize: 8
      })
        .then(res => {
          this.courseList = res.rows
        })
        .catch(err => {
          console.log(err)
        })
    },

    // 获取轮播图
    getBannerList() {
      getBannerList({})
        .then(res => {
          this.bannerList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    },

  }
}
</script>
<style lang="less" scoped>
@import './index';

</style>
